<template>
  <div class="card">
    <section class="card_title">
      <span style="font-weight: bold;">{{ props?.title }}</span>
      <router-link :to="props?.path" class="card_title_link" v-if="props?.isShowLink">更多</router-link>
      <template v-if="!props?.isShowLink"></template>
    </section>
    <section class="card_content">
        <slot name="content"></slot>
    </section>
  </div>
</template>

<script setup>
const props = defineProps({
  title: {
    type: String,
    default:'标题',
  },
  path: {
    type: String,
    default:'',
  },
  isShowLink:{
    type: Boolean,
    default:true
  }
})
</script>

<style lang="less" scoped>
.card{
  width: 96%;
  box-sizing: border-box;
  padding: 8px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,.1);
  border-radius: 6px;
  margin: 0 auto;
  margin-top: 8px;
  &_title{
    height: 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    &_link{
      font-size: 12px;
    }
  }
}
</style>
